<template>

    <a-form layout="inline" v-if="!isSender" class="rx-a-form-read" :colon="false">
        <a-row :gutter="24">
            <a-col :span="12">
                <a-form-item :label="$ti18('rxList.title','标题')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                {{ infInnerMsg.msgTitle }}
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                <a-form-item :label="i18n('form.sender','发送人')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                <a-tag>
                    <a-icon type="user"></a-icon>
                    {{ infInnerMsg[sender] }}
                </a-tag>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                <a-form-item :label="i18n('form.sendTime','发送时间')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                {{ infInnerMsg.createTime }}
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24">
                <a-form-item :label="i18n('form.msgContent','内容')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24">
                <p v-html="infInnerMsg.content"></p>
            </a-col>
        </a-row>
    </a-form>
    <a-form layout="inline" v-else>
        <a-row :gutter="24">
            <a-col :span="12">
                <a-form-item :label="$ti18('rxList.title','标题')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                {{ infInnerMsg.msgTitle }}
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24">
                <a-form-item :label="i18n('list.sendUser','发送至用户')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24">
          <span>
            <a-tag v-for="user in infInnerMsg.userList"><a-icon type="user"></a-icon>{{ user.name }}</a-tag>
          </span>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24">
                <a-form-item :label="i18n('list.sendGroup','发送至用户组')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="18">
          <span>
            <a-tag v-for="group in infInnerMsg.groupList"><a-icon type="team"></a-icon>{{ group.name }}</a-tag>
          </span>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                <a-form-item :label="i18n('form.sendTime','发送时间')">

                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="12">
                {{ infInnerMsg.createTime }}
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24">
                <a-form-item :label="i18n('form.msgContent','内容')">
                </a-form-item>
            </a-col>
        </a-row>
        <a-row :gutter="24">
            <a-col :span="24">
                {{ infInnerMsg.content }}
            </a-col>
        </a-row>
    </a-form>
</template>
<script>

export default {
    name: 'InfInnerMsgEdit',
    components: {},
    props: {
        infInnerMsg: {
            type: Object,
            default: {}
        },
        sender: {
            type: String,
            default: 'sender'
        },
        isSender: {
            type: Boolean,
            default: false
        }
    },
    data() {
        return {}
    },
    created() {
    },
    methods: {
        i18n(name, text, key) {
            return this.$ti18(name, text, "infInnerMsg", key);
        },
    },
}
</script>
<style scoped>
.rx-a-form-read >>> .ant-form-item-label label{
    font-weight: bold;
}
.rx-a-form-read{
    padding: 16px;
    width:100%;
    height: 100px;
    overflow: auto;
    display: block;
    min-height: 100%;
}
</style>
